<!DOCTYPE html>
<html lang="en">

  <head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
  </head>

  <body>

  </body>
  <script src="./jquery-1.11.3.js"></script>
  <script>
    // 多重需求的函数封装
    function proAjax(url) {
      return new Promise((resolve, reject) => {
        $.ajax({
          url,
          type: "GET",
          success(res) {
            resolve(res);
          },
          error(err) {
            reject(err);
          }
        })
      })
    }

    let p1 = proAjax("http://kumanxuan1.f3322.net:8809/index/banners/travel");
    let p2 = proAjax("http://kumanxuan1.f3322.net:8809/strategies/themes");
    let p3 = proAjax("http://kumanxuan1.f3322.net:8809/travels/query");


    p1.then(res => { // 异步
      // 处理正确的业务逻辑
      console.log("第一个");
      return p2; // 相当于修改了后面的.then的指向
    }).then(res => {
      console.log("第二个");
      return p3;
    }).then(res => {
      console.log("第三个");
    })


    // 1. 解决了回调地狱的问题
    // 2. 异步代码看起来像同步代码
    // 3.定义：promise 异步编程的解决方案
  </script>

</html>